<template>
  <div class="container">
    <div style="border-bottom:1px solid #ccc;padding-bottom:50px">
      <div class="card_nd_title">
        <span>用药调整</span>
        <div class="line" style="width:64px;"></div>
      </div>
      <div class="card_content">
        <a-row class="drug_list" v-for="(item, index) in report" :key="index">
          <a-col :span="4" class="list_left">
            <a-badge status="processing" />
            <p>{{ item.drugSuggestTime.slice(0, 10) }}</p>
          </a-col>
          <a-col :span="18" :offset="2" class="list_right">
            <p>{{ item.drugSuggest }}</p>
          </a-col>
        </a-row>
      </div>
    </div>
  </div>
</template>

<script>
export default {
  name: 'Drug',
  props: ['report'],
  data() {
    return {
      images: null
    }
  },
  methods: {}
}
</script>

<style lang="less" scoped>
@media print {
  .container {
    page-break-after: always;
  }
}
.container {
  padding: 50px 24px 0 24px;
}
.card_content {
  margin-top: 15px;
  img {
    width: 207px;
    height: 448px;
  }
}
.card_nd_title {
  margin-bottom: 30px;
  span {
    font-size: 16px;
    // padding-left: 10px;
    font-weight: bold;
    color: #000;
  }
}
.line {
  height: 6px;
  border-radius: 6px;
  // margin-left: 10px;
  background-color: #00b5d4;
  opacity: 0.3;
}
.drug_list {
  .list_left {
    border-right: 1px solid #ccc;
    padding-right: 10px;
    p {
      display: inline-block;
    }
  }
  p {
    margin: 0;
  }
}
</style>

